<template>
  <div>
    <div class="tou">
   <header1></header1>
   <header2></header2>
    <ul>
      <li><router-link to="/hot">热映</router-link></li>
      <li><router-link to="/cinema">影院</router-link></li>
      <li><router-link to="/wait">待映</router-link></li>
      <li><router-link to="/classic">经典电影</router-link></li>
      <img src="../../assets/a.jpg" alt="">
    </ul>
    
    </div>
    <div class="con">
    <router-view></router-view>
    </div>
  </div>
</template>

<script>
import header1 from "../../components/commonh/header1.vue";
import header2 from "@/components/commonh/header2.vue";
export default {
  name: "movie",
 components: {
   header1,header2
 },
};
</script>
 

<style>
ul img{
    width: 20px;
    height: 20px;
    margin-top: 15px;
}
.con {
  margin-top: 154.5px;
  margin-bottom: 51px;
}
.tou{
  
   position: fixed;
  top: 0;
  width: 100%;
  height: 154.5px;
  z-index:999;
}
    ul{
      display: flex;
      list-style: none;
      justify-content: space-around;
      border-bottom: 1px solid grey;
      background: white;
      height: 50px;
      line-height: 50px;
      
    }
     .header2{
            
            background-color: white;
            display: flex;
            align-items: center;
            justify-content: space-around;
            font-size: 14px;
            border-bottom: 1px solid grey;
            
        }
    .header2 img{
            width: 50px;
            height: 30px;
            margin-left: 20px;
        }
        .dian{
            margin-left: 6.666667rem;
        }
        .open{
            margin-left: 1.333333rem;
            color: rgb(180, 84, 84);
            font-weight: 500;
        }
</style>